/*
* 苏州海管家物流科技有限公司（https://www.hgj.com/）.
* 苏公网安备32059002003385号 © 2015-2022 Hgj.com All Rights Reserved. | 苏ICP备15030950号.
* @Date: 2022.05.21.
* @Author
* @Description 企点管理后台 -分页 组件.
**/
<script setup lang="ts" name="Pagination">
// 传入分页参数
import {toRefs} from "vue"

interface IProps {
    total: number // 总条数
    size: number // 每一页条数
    num: number // 当前页
}
// emit 方法使用的数据类型
interface IEmit {
    // eslint-disable-next-line no-unused-vars
    (e: 'emitCurrentPage', data: number): void,
}

const props = withDefaults(defineProps<IProps>(), {
    total: 0,
    size: 10,
    num: 1
})
const emit = defineEmits<IEmit>()
console.log('props------------------', props)

const { total, size, num } = toRefs(props)

console.log('total, size, num==========', total, size, num)

/**
 *@Description 当前页 change 事件.
 *@Return .
 **/
const handleCurrentPageChange = (val: number) => {
    emit('emitCurrentPage', val)
    console.log('当前页', val)
}

</script>

<template>

  <el-pagination
    small background layout="prev, pager, next" :total="total" :page-size="size"
    v-model:current-page="num" @current-change="handleCurrentPageChange" />

</template>

<style lang="scss" scoped>

</style>
